<template>
    <!-- 会员充值码弹窗 -->
    <z-popup v-model:show="rechargeShow" closeable title="会员码">
        <div class="popup-recharge">
            <div class="popup-recharge-cover">
              <canvas ref="qrCanvas"></canvas>     
            </div>
            <!-- 0011 ams设定成积分商城的推广码 -->
            <div class="popup-recharge-waiter" v-if="ls.get('BRAND_CODE') != '0011'" >推广人：{{userInfo.userName}} (已推广：{{tgNum}}人)</div>
            
        </div>
    </z-popup>
</template>
<script setup>

import ls from '@/lib/ls'
import Api from '@/api'
import QRCode from 'qrcode'
import logo from '@/assets/images/common/i_icon_2logo.png'

const rechargeShow = ref(false)
const userInfo = ref(ls.get('USER_INFO'))


const code = ref('')


// 版本 正式版为 release 体验版为 trial 开发版为 develop
let baseUrl = ref('')

if(ls.get('BRAND_CODE') == '0003'){ // 没有开发版
    
  baseUrl.value = 'https://jtmckj.com/qnjg/'; 

  }else if (ls.get('BRAND_CODE') == '0002'){
    
    baseUrl.value = 'https://jtmckj.com/mt/';

  }else if (ls.get('BRAND_CODE') == '0004'){
    
    baseUrl.value = 'https://jtmckj.com/ch/'; 

  }else if (ls.get('BRAND_CODE') == '0005'){
    
    baseUrl.value = 'https://jtmckj.com/kbq/';

  }else if (ls.get('BRAND_CODE') == '0006'){
    
    baseUrl.value = 'https://jtmckj.com/tgx/';

  }else if (ls.get('BRAND_CODE') == '0007'){
    
    baseUrl.value = 'https://jtmckj.com/zttt/';

  }else if (ls.get('BRAND_CODE') == '0008'){
    
    baseUrl.value = 'https://jtmckj.com/xxc/';

  }else if (ls.get('BRAND_CODE') == '0009'){
    
    baseUrl.value = 'https://jtmckj.com/ylly/';

  }else if (ls.get('BRAND_CODE') == '0010'){
    
    baseUrl.value = 'https://jtmckj.com/xy/';

  }else if (ls.get('BRAND_CODE') == '0011'){
    
    baseUrl.value = 'https://jtmckj.com/ams/';

  }else if (ls.get('BRAND_CODE') == '0029'){
    
    baseUrl.value = 'https://jtmckj.com/as/';

  }
const params = { link: 'other', org: ls.get('ORG_CODE'),code:'',userCode:userInfo.value.userCode,brd:ls.get('BRAND_CODE') }
const qrCanvas = ref(null);

const generateQRCode = async (baseUrl,params,logoUrl) => {
  if(ls.get('BRAND_CODE') == '0011'){
    params.link = 'pointShop'
  }
  params.brd = ls.get('BRAND_CODE')
  params.userCode = userInfo.value.userCode
  console.log(baseUrl,params);
  await nextTick();
  if (qrCanvas.value) {
    const urlWithParams = `${baseUrl}?${new URLSearchParams(params).toString()}`;
    await QRCode.toCanvas(qrCanvas.value, urlWithParams, { width: 240,margin: 2 });

    addLogoToQRCode(qrCanvas.value, logoUrl);
    
  }
};

const addLogoToQRCode = (qrCodeCanvas, logoUrl) => {
  const ctx = qrCodeCanvas.getContext('2d');
  const logoImg = new Image();
  const qrCodeImg = new Image();

  logoImg.onload = () => {
    qrCodeImg.onload = () => {
      const logoSize = Math.floor(qrCodeCanvas.width / 5); // Adjust logo size
      ctx.drawImage(qrCodeImg, 0, 0);
      ctx.drawImage(logoImg, (qrCodeCanvas.width - logoSize) / 2, (qrCodeCanvas.height - logoSize) / 2, logoSize, logoSize);
    };
    qrCodeImg.src = qrCodeCanvas.toDataURL();
  };
  logoImg.src = logoUrl;
};
const logo1 = ls.get('LOGO') || ''
generateQRCode(baseUrl.value,params,logo1);
const tgNum = ref(0)
const doGetPromotionCount = ()=>{
  Api.Common.AppObjProcess.Do({
      functionName: "GetPromotionCount",
      contentData: '',
    })
      .then((res) => {
        console.log(res);
        tgNum.value = res.promotionCount
      })
}
doGetPromotionCount()

</script>
<style scoped lang="scss">

.popup-recharge {
    width: 334px;
    padding: 0 47px 13px;
    text-align: center;

    &-cover {
        padding-top: 30px;
    }
    &__code {
        display: block;
        width: 100%;
    }
    &-waiter {
        margin: auto;
        background: #5C5C66;
        border-radius: 2px;
        padding: 4px 15px;
        font-size: 13px;
        font-family: PingFang SC;
        font-weight: 500;
        color: #CCCCCC;
        line-height: 13px;
        display: inline-block;
        margin-top: 24px;
    }
}

</style>